/**
 * EventEmpty 暂无数据
 * @author: muisuidaan
 */

import styled from "styled-components";
import icon_no_data from "@/assets/icons/icon-no-data.png";
import { FlexDiv } from "./SelectInput";
import { RedBtn } from "../Button";
import { RedTitle } from "../Title/redTitile";
import { Fragment, useEffect, useState } from "react";

const Content = ({ className, style, title, imgStyle }) => (
  <div className={className} style={style}>
    <img src={icon_no_data} alt="" style={imgStyle} />
    <p>{title || "无可配置参数"}</p>
  </div>
);

// /解释说明文案
const EventEmpty = styled(Content)`
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 40px 0;
  background: #fff;
  img {
    /* width: 186px;
    height: 127px; */
    width: 120px;
    height: 82px;
  }
  p {
    font-family: PingFangSC-Regular;
    font-weight: 400;
    font-size: 13px;
    color: rgba(53, 66, 94, 0.4);
    line-height: 28px;
    margin: 0;
  }
`;
const EventEmptyCom = (props: any) => {
  const { eventInfo, onSubmit, enable } = props;
  const [isChanged, setIsChanged] = useState(false);
  useEffect(() => {
    setIsChanged(false);
  }, [eventInfo]);
  const onClick = () => {
    onSubmit({
      id: parseFloat(eventInfo.key),
    });
  };
  useEffect(() => {
    if (enable !== undefined && enable !== eventInfo?.enable) {
      setIsChanged(true);
    }
  }, [enable]);

  return (
    <div>
      {eventInfo?.fundType ? ( // 阈值配置下特别处理
        <Fragment>
          <div style={{border: '1px solid #E4E4E4', height: 313, marginTop:8, display:'flex', justifyContent:'space-around', alignItems:'center'}}>
            <EventEmpty {...props} />
          </div>
          <FlexDiv style={{ marginTop: 12, alignItems: "flex-end" }}>
            <RedBtn disabled={!isChanged} onClick={onClick}>
              确定
            </RedBtn>
            {/* 按钮说明文案 */}
            {isChanged && <RedTitle eventInfo={eventInfo}></RedTitle>}
          </FlexDiv>
        </Fragment>
      ) : (
        <EventEmpty {...props} />
      )}
    </div>
  );
};

export default EventEmptyCom;
